/** *
 * case 1: use prototype implement extends
 */

function setOptions(target, args) {
  if (!target || !args) {
    return
  }
  for (const key in args) {
    if (!args[key]) {
      continue
    }
    target[key] = args[key]
  }
}

function Block({ id = String } = {}) {
  this.class = 'Block'
  setOptions(this, arguments[0])
}
Block.prototype = {
  call() {
    console.log(`here is ${this.class}`)
  },
  log() {
    console.log(`Block[${this.id}]`)
  },
  constructor: Block
}

function Text({ id, text } = {}) {
  Block.call(this, id)
  setOptions(this, arguments[0])
  this.text = text
  // console.log('arguments ... ', arguments)
}
// Text.prototype = Block.prototype
// Text.prototype = new Block()
Text.prototype = new Block()
Text.prototype.log = function() {
  console.log(`Text[${this.id}] content ${this.text}`)
  this.call()
}
Text.prototype.constructor = Text

function Line({ id, length } = {}) {
  // Block.call(this, id)
  setOptions(this, arguments[0])
  this.length = length
}
Line.prototype = {
  ...Block.prototype,
  log() {
    console.log(`Line[${this.id}] length ${this.length}.`)
  },
  constructor: Line
}

/* function prototype(child, parent) {
  let prototype = (function CreateObj(o) {
    function F() {}
    F.prototype = o
    return new F()
  })(parent.prototype)
  prototype.constructor = child
  // child.prototype = Object.assign(child.prototype, prototype)
  child.prototype = prototype
}

prototype(Text, Block)*/

const block = new Block({ id: 'block' })
const text = new Text({ id: 'text', text: 'hey' })
const line = new Line({ id: 'line', length: 5 })

block.log()
text.log()
line.log()

console.log('block', block.constructor)
console.log('text', text.constructor)
console.log('line', line.constructor)

/** *
 * case 2: use class implement extends
 */
class Ele {
  id = 'ele'
  name = 'temp'
  call() {
    console.log('ele ...', this.id)
  }
  constructor(id, name) {
    this.id = id
    this.name = name
  }
}
class Div extends Ele {
  w = 'asdasd';
  h;
  x;
  y;
  call() {
    console.log('call ...', this.id, this.name, this.w)
  }
  constructor(id, name, w) {
    super(id, name)
    this.w = w
  }
}

export default Div

